.novel-publish-layout {
  background-color: #f5f5f5;

  height: 100vh; /* 全视口高度 */
  overflow: hidden; /* 禁用外层滚动 */
  display: flex;
  flex-direction: column;
}

.publish-header {
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  
  height: 64px;
  flex: 0 0 auto; /* 不伸缩 */
  height: 64px;
  position: sticky;
  top: 0;
  z-index: 100;
  
  .header-content {
    display: flex;
    align-items: center;
    
    max-width: 1200px;
    margin: 0 auto;
    
    h2 {
      margin: 0 24px;
      flex: 1;
    }
    
    .action-buttons {
      button {
        margin-left: 12px;
      }
    }
  }
}

.content-layout {
  background-color: #f1f1f1fb;
  
  .publish-content {  
    overflow-y: auto; /* 只有内容区可滚动 */
    max-width: 110vh;
    margin: 64px auto;
    padding: 0 24px;
    flex: 1;
    width: 100%;

    .editor-card {
      
      height: 100%;
      padding-bottom: 20vh;

      .title-input {
        font-size: x-large;
        color: #2b3138;
      }
      
      .custom-quill-editor {
        .ql-container {
          // overflow: auto;
          border: none !important;
          font-size: 16px;

          height: 100%;
        }
        
        .ql-editor {
          padding: 24px;
          line-height: 1.5 !important; /* 行内行距 */
          // 长单词显示
          word-break: break-all;
          
          p {
            margin-bottom: 1.5em !important; /* 段落间距 */
            text-indent: 2em !important; /* 首行缩进 */
          }

          


        }


        .ql-editor:focus,
        .ql-editor.ql-blank::before,
        .ql-tooltip {
          outline: none !important;
          box-shadow: none !important;
          border: none !important;
        }


      }
      
    }
  }
}

.publish-footer {
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  
  flex: 0 0 auto; /* 不伸缩 */
  position: sticky;
  bottom: 0;
  z-index: 100;
  padding: 0 24px;


  .editor-footer {
    display: flex;
    border-top: 1px solid #f0f0f0;
    bottom: 0;
    position: sticky;
    padding: 8px 24px;

    align-items: center;
    justify-content: start;
    .footer-word-counter{
      color: #7a7a7a;
    }

    .footer-btns {
      margin-left: 36%;
      .not-first-btn {
        margin: 4px;
      }
    }
  }
}